import React from 'react';
import {WeaDialog,WeaInput} from 'ecCom';
import {Button,Row,Col,message} from 'antd';

export default class Main extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            value : ''
        }
    }

    saveDate () {

        if(!this.state.value){
            message.warning('红色*号为必填项');
            jQuery(".saveInput .ant-input")[0].focus();
            return ;
        }

        this.props.handleOk(this.state.value);
        this.handleCancel();
        console.log('save');
    }

    more () {

        console.log('more');
    }

    handleCancel = () => {
        console.log('cancel');
        this.setState({value : ''});
        this.props.handleCancle();
    }

    render () {
        const {value} = this.state;
        const {visible} = this.props;
        const footer = [
            <Button key="save" type="primary" size="large" onClick={() => this.saveDate()}>保存</Button>,
            <Button key="back" type="ghost" size="large" onClick={() => this.more()}>更多>></Button>
        ];
        return (
            <div>
                <WeaDialog
                    className=""
                    title={'另存为'}
                    visible={visible}
                    icon={"icon-coms-workflow"}
                    iconBgcolor="#0079DE"
                    maskClosable={false}
                    buttons={footer}
                    onCancel={this.handleCancel}
                    style={{width : 600}}
                >
                    <Row style={{lineHeight : 12}}>
                        <Col span={5} offset={3}>
                            <span>报表名称：</span>
                        </Col>
                        <Col span={14}>
                            <div className="saveInput">
                                <WeaInput
                                    value={value}
                                    viewAttr={3}
                                    onChange={v=>this.setState({value : v})}
                                />
                            </div>
                        </Col>
                    </Row>
                </WeaDialog>
            </div>
        )
    }
}